Ideenreichs Dr. Web - http://www.ideenreich.com/drweb.shtml - 1998

Start | Erfolgreiche Seiten | Häufige Fehler | In- und Outliste | Anfängerniveau | 10 Todsünden | Wie geht das in HTML? | Frust & Frames | Javascript Ärger | Mehr Hits | Werbeflut | Metatags | Suchmaschinen I | Suchmaschinen II | HTML schneller machen | Freibeuter der Netze |

Dr. Web - Kompakt

Wie geht das in HTML?

An dieser Stelle möchten wir Ihr Augenmerk auf einige Befehle und Probleme richten. Auf Dinge, die leicht zu übersehen sind. Und auf HTML-Befehle, die selten oder nur unvollständig angewendet werden.

Images richtig einbinden:

Damit man sich auch bei abgeschalteter Grafikanzeige zurechtfindet gibt's den ALT Tag. Außerdem wird der Text beim drüberfahren mit der Maus angezeigt. Damit ein Browser Text vor den Grafiken laden kann, müssen alle Images mit Angaben zu Width und Height ausgestattet werden. Nun wissen Text und Grafik, wo sie hin gehören und beim Seitenaufbau ruckelt's nicht mehr so.

<img src="logo.gif" alt="Willkommen auf meiner Homepage" border="0" width="98" height="65">(Angaben in Pixel)

ALT-Tags

Es genügt nicht, einfach die automatischen Voreinstellungen der Editor Software zu übernehmen. Frontpage 3.0 z.B. setzt ALT Tags nach folgendem Muster ein: logneu.gif (5654kb). Was soll ein Gast damit anfangen? Nutzen Sie diese Möglichkeiten für zusätzliche Erklärungen.

Auch einige Suchmaschinen werten ALT Tags, insbesondere wenn Sie Seiten ohne Text produzieren!

Und noch etwas: Für Sehbehinderte mit Screenreadern sind die ALT-Tags logischerweise eine wichtige Informationsquelle. Denn die sehen von all Ihren schönen Grafiken gar nichts.


Bild nahtlos links oben plazieren:

Erste Methode: in den body tag wird eingefügt: topmargin="0" leftmargin="0" - Funktioniert nur mit den Microsoft Browsern 3-4

Zweite Methode: Style Sheets:
<STYLE>
.tabs {position: absolute; top: 0pt; left: 0pt}
</STYLE>
<BODY...
<div class="tabs" id="tabs">
Funktioniert nur mit 4.0 Browsern

Dritte Methode:
Das zu plazierende Bild als Hintergrund einsetzen und entsprechend weite Ränder lassen (Breite 1680 Pixel).


 

Frames:

Damit sich externe Links nicht im Framefenster öffnen und sich so immer weiter verschachteln, sollte die Syntax wie folgt ausssehen:

<a href="http://www.neuesite.com/index.html" target="_top">

Target="_top" können Sie natürlich auch zu anderen Zwecken einsetzen.


Frames ohne Trennlinien

<FRAMESET ROWS = "10%,90% " BORDER="0" FRAMESPACING="0" FRAMEBORDER="NO">
<FRAME SRC="seite1.htm" NAME="leiste" SCROLLING="NO" >
<FRAME SRC="seite2.htm" NAME="haupt" RESIZE>
</FRAMESET>


Mailto Link mit vordefiniertem Subject:

mailto:KlausMueller@gmx.net?subject=Mein Stichwort


Musik auf der Homepage?

Kein Problem mit Embed. Bgsound läuft nur mit dem Microsoft Browser

<EMBED src="meinhit.mid" " border="0" width="51" height="15" autostart="true" loop="true" controls="smallconsole"></EMBED>

Die Smallconsole ist ein winziges Kontrollelement, mit dem man die laufende Musik ausschalten kann. autostart="true" sorgt dafür, daß sich die Musik unmittelbar nach dem Laden einschaltet. loop="true" ist eine Endlosschleife

Bitte bedenken Sie, das Musik auf der Homepage häufig störend wirkt und nicht unbedingt jeder Besucher Ihren Geschmack teilt. Übrigens .wav Files verbieten sich schon ihrer Größe wegen.


Formulare

Einfache Mailto-Forms können nicht vom Microsoft Browser 3.x verarbeitet werden. Bei ca. 20% Marktanteil ein echtes Problem. Wenn Sie über kein eigenes CGI Verzeichnis verfügen, können Sie auf externe Dienstleister zurückgreifen. Die stellen Ihnen kostenlos alle Möglichkeiten eines echten CGI Mail Formulars zur Verfügung.


Image Maps mit ALT Tags:

Das sieht dann innerhalb einer Image Map wie folgt aus:

<AREA SHAPE="RECT" ALT="Link" COORDS="311, 2, 427, 20" HREF="link.htm">

Es ist ebenfalls möglich "on mouse over" Befehle einzubinden.


Höher- und Tieferstellen

Ein betagter aber recht selteneingesetzter Befehl

<sup>stellt den Text höher</sup>
<sub>stellt den Text tiefer</sub>


Besucher automatisch auf eine andere Seite weiterleiten:

Nach 10 Sekunden werden Ihre Besucher automatisch auf die Seite 2 weitergeleitet. Dieser Meta Befehl wird zwischen <head> und </head> eingesetzt.

<meta http-equiv="refresh" content="10; URL=seite2.html">


Titel für Hyperlinks

Auch das ist jetzt möglich. Versehen Sie Textlinks mit Erklärungstexten, die (analog zum Alt Tag bei Grafiken) beim Drüberfahren mit der Maus angezeigt werden:

Funktioniert nur mit MS Browser ab 4.0 und Opera ab 3.0. Sie können diesen Befehl unbesorgt einsetzen, da er von anderen Browsern ignoriert wird. Und so gehts:

<A HREF="link.htm" Title="Ihre Information">Link</A>

Beispiele finden Sie in meiner Menüleiste. TITLE können Sie auch auf Tabellen, Tabellenzeilen, Formulareingabefelder oder den Bodytext anwenden!

zurücknach obenweiter

© 1999 Ideenreich - Heidekamp 2 - 22926 Ahrensburg - Tel: 04102/59532 - FAX: 04102/821951- Verantwortlicher Redakteur: Sven Lennartz